<template>
  <div class="common-table-operations-component">
    <div class="left-actions">
      <span v-if="selectedCount > 0" class="selected-count">
        {{ $t('common.selectedItems', { count: selectedCount }) }}
      </span>
      <div class="action-buttons">
        <a-upload :show-upload-list="false" :before-upload="beforeUpload">
          <a-button type="primary">
            <template #icon><UploadOutlined /></template>{{ $t('file.upload') }}
          </a-button>
        </a-upload>
        <a-button danger :disabled="selectedCount === 0" @click="$emit('batch-delete')">
          <template #icon><DeleteOutlined /></template>{{ $t('common.batchDelete') }}
        </a-button>
        <a-button @click="$emit('refresh')">
          <template #icon><ReloadOutlined /></template>{{ $t('common.refresh') }}
        </a-button>
      </div>
    </div>
    <div class="right-actions">
      <a-button @click="$emit('reset')">
        <template #icon><ReloadOutlined /></template>{{ $t('common.reset') }}
      </a-button>
      <a-button type="primary" @click="$emit('search')">
        <template #icon><SearchOutlined /></template>{{ $t('common.search') }}
      </a-button>
    </div>
  </div>
</template>

<script lang="ts" setup>
defineOptions({
  name: 'TableOperations'
})

withDefaults(defineProps<{
  selectedCount?: number
  beforeUpload: (file: File, fileList: File[]) => boolean | Promise<void>
}>(), {
  selectedCount: 0
})

// Emits定义
const emit = defineEmits(['batch-delete', 'refresh', 'search', 'reset'])
</script>

<style lang="scss" scoped>
@import '@/assets/styles/views/common.scss';
</style>